<template>
	<view style="background-color: #f1f1f1;">
		<homePage v-if="PageCur=='homePage'"></homePage>
		<information v-if="PageCur=='information'"></information>
		<welfare v-if="PageCur=='welfare'"></welfare>
		<user v-if="PageCur=='user'"></user>
		<view class="cu-bar tabbar bg-white shadow foot">
			<view class="action" @click="NavChange" data-cur="homePage">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/tabBar/homePage' + [PageCur=='homePage'?'_selected':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='homePage'?'.text-pink':'text-gray'">首页</view>
			</view>
			<view class="action" @click="NavChange" data-cur="information">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/tabBar/information' + [PageCur == 'information'?'_selected':''] + '.png'">
					</image>
				</view>
				<view :class="PageCur=='information'?'.text-pink':'text-gray'">资讯</view>
			</view>
			<view class="action" @click="NavChange" data-cur="welfare">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/tabBar/welfare' + [PageCur == 'welfare'?'_selected':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='welfare'?'.text-pink':'text-gray'">福利</view>
			</view>
			<view class="action" @click="NavChange" data-cur="user">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/tabBar/user' + [PageCur == 'user'?'_selected':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='user'?'.text-pink':'text-gray'">我的</view>
			</view>
		</view>
	</view>
</template>

<script>
	import homePage from '../homePage/index.vue'
	import information from '../information/index.vue'
	import welfare from '../welfare/index.vue'
	import user from '../user/index.vue'

	export default {
		components: {
			homePage,
			information,
			welfare,
			user
		},
		data() {
			return {
				PageCur: 'homePage'
			}
		},
		methods: {
			NavChange: function(e) {
				this.PageCur = e.currentTarget.dataset.cur
			},
		}
	}
</script>

<style scoped>

</style>
